<template>
  <div class="homeItem">
    <div class="homeHead ">
      <div class="homeTit flex pb30">
        <text class="font32 bold">{{item.name}}</text>
        <text class="font32 bold cor297">{{item.price}}</text>
      </div>
      <div class="homeDes flex pb30">
        <div>
          <van-tag v-for="(i,k) in item.type" :key="k" v-if="k<3" class="mr35" color="#EEF4FE"  text-color="#3C567F" size="medium">{{i}}</van-tag>
        </div>
        <div class="font24">{{item.address}}</div>
      </div>
    </div>
    <div class="homeFoot font26 flex_line_center">
      {{item.com}}
    </div>
  </div>
</template>

<script>
export default {
  props: {
    item:{
      type:Object,
      default:()=>{
        return {}
      }
    },
  },
}
</script>

<style lang="less" scoped>
.homeItem{
  width: 100%;
  margin: 20rpx 0;
  box-sizing: border-box;
  padding-top: 38rpx;
  border-radius: 20rpx;
  box-shadow: 0px 3px 8px 0px rgba(186, 186, 186, 0.5);
  .homeHead{
    padding: 0 30rpx;
    .homeTit{

    }
  }
  .homeFoot{
    padding: 0 30rpx;
    border-top: 1px solid #f5f5f5;
    height: 102rpx;
  }
}
</style>